<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="../../vars.jsp" %>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="ECharts">
  <meta name="author" content="kener.linfeng@gmail.com">
  <title>WAS SERVER重要指标监控</title>
  <link href="${contextPath}/page/common/css/bootstrap.css" rel="stylesheet">
  <link href="${contextPath}/page/common/css/echartsHome.css" rel="stylesheet">
  <script src="${contextPath}/page/common/js/chart/echarts.js"></script>
  <script src="${contextPath}/page/common/js/chart/codemirror.js"></script>

</head>
<body>
<div class="container-fluid">


  <div style="display:none">

    <textarea id="code" name="code">
            option = {
                title : {
                    text: '未来一周气温变化',
                    subtext: '纯属虚构'
                },
                tooltip : {
                    trigger: 'axis'
                },
                legend: {
                    data:['最高气温','最低气温']
                },
                toolbox: {
                    show : true,
                    feature : {
                        mark : {show: true},
                        dataView : {show: true, readOnly: false},
                        magicType : {show: true, type: ['line', 'bar']},
                        restore : {show: true},
                        saveAsImage : {show: true}
                    }
                },
                calculable : true,
                xAxis : [
                    {
                        type : 'category',
                        boundaryGap : false,
                        data : ['周一','周二','周三','周四','周五','周六','周日']
                    }
                ],
                yAxis : [
                    {
                        type : 'value',
                        axisLabel : {
                            formatter: '{value} °C'
                        }
                    }
                ],
                series : [
                    {
                        name:'最高气温',
                        type:'line',
                        data:[11, 11, 15, 13, 12, 13, 10],
                        markPoint : {
                            data : [
                                {type : 'max', name: '最大值'},
                                {type : 'min', name: '最小值'}
                            ]
                        },
                        markLine : {
                            data : [
                                {type : 'average', name: '平均值'}
                            ]
                        }
                    },
                    {
                        name:'最低气温',
                        type:'line',
                        data:[1, -2, 2, 5, 3, 2, 0],
                        markPoint : {
                            data : [
                                {name : '周最低', value : -2, xAxis: 1, yAxis: -1.5}
                            ]
                        },
                        markLine : {
                            data : [
                                {type : 'average', name : '平均值'}
                            ]
                        }
                    }
                ]
            };
    </textarea>

  </div>
  <!--/span-->
  <div id="graphic" class="col-md-8">
    <div id="main" class="main"></div>
    <div style="display:none">
      <select id="theme-select"></select>
      <span id='wrong-message' style="color:red"></span>
    </div>
  </div>
</div>

<script src="${contextPath}/page/common/js/chart/jquery.min.js"></script>
<%@ include file="chartline.jsp" %>
</body>
</html>
